<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset={$codepay_config['chart']}">
    <meta http-equiv="Content-Language" content="zh-cn">
    <meta name="apple-mobile-web-app-capable" content="no"/>
    <meta name="apple-touch-fullscreen" content="yes"/>
    <meta name="format-detection" content="telephone=no,email=no"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="white">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>{$typeName}扫码支付</title>
    <link href="{$codepay_path}/css/wechat_pay.css" rel="stylesheet" media="screen">
    <link href="//lib.baomitu.com/toastr.js/latest/css/toastr.min.css" rel="stylesheet">
    <link href="//lib.baomitu.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<body>
<div class="body">
    <h1 class="mod-title">
        <span class="ico_log ico-{$type}"></span>
    </h1>

    <div class="mod-ct">
        <div class="order" style="color:red;font-size:16px">请务必规定时间内支付下面显示的金额
        </div>

        <div class="amount" style="position: relative;"><span id="money">￥{$price}</span>
            <div style="position: absolute;font-size: 10px;top: 29px;left: 75%;"><a href="#" class="copy" id="copy" data-clipboard-text="{$user_data['money']}">复制金额</a>
            </div>
        </div>
        <div class="qrcode-img-wrapper" data-role="qrPayImgWrapper">
            <div data-role="qrPayImg" class="qrcode-img-area">
                <div class="ui-loading qrcode-loading" data-role="qrPayImgLoading" style="display: none;">加载中</div>
                <div style="position: relative;display: inline-block;">
                    <img id='show_qrcode' alt="加载中..." src="{$qr}" width="210" height="210" style="display: block;">
                    <img onclick="$('#use').hide()" id="use" src="{$codepay_path}/img/use_{$type}.png"
                         style="position: absolute;top: 50%;left: 50%;width:32px;height:32px;margin-left: -21px;margin-top: -21px">
                </div>
            </div>


        </div>

        <!--        这里加一些自己的提示-->
        <div class="time-item" id="msg">
            <h1>二维码过期时间</h1>
            <strong id="hour_show">0时</strong>
            <strong id="minute_show">0分</strong>
            <strong id="second_show">0秒</strong>
        </div>

        <div class="tip">
            <div class="ico-scan"></div>
            <div class="tip-text">
                <p>请使用{$typeName}扫一扫</p>
                <p>扫描二维码完成支付</p>
                <p>
                <div id="kf" style="display:none;"></div>
                </p>
            </div>
        </div>

        <div class="detail" id="orderDetail">
            <dl class="detail-ct" id="desc" style="display: none;">


            </dl>
            <a href="javascript:void(0)" class="arrow"><i class="ico-arrow"></i></a>
        </div>

        <div class="tip-text">
        </div>


    </div>
    <div class="foot">
        <div class="inner">
            <p>手机用户可保存上方二维码到手机中</p>
            <p>在{$typeName}扫一扫中选择“相册”即可</p>
            <p>
            <div id="kfqq"></div>
            </p>
        </div>
    </div>

</div>
<div class="copyRight"></div>
<!--注意下面加载顺序 顺序错乱会影响业务-->
<script src="{$codepay_path}/js/jquery-1.10.2.min.js"></script>
<!--[if lt IE 8]>
<script src="{$codepay_path}/js/json3.min.js"></script><![endif]-->
<script>
    var user_data = {$user_data|json_encode}
</script>
<script src="{$codepay_path}/js/notify.js"></script>
<script src="{$codepay_path}/js/codepay_util.js?v=2.1"></script>
{$codepay_html}
<script src="//lib.baomitu.com/toastr.js/latest/js/toastr.min.js"></script>
<script src="//lib.baomitu.com/clipboard.js/1.7.1/clipboard.min.js"></script>
<script>
    setTimeout(function () {
        $('#use').hide()
    }, user_data.logShowTime || 1000);

    check_pay = function () {
        $.get("/Code_Pay/getShop?trade_no=" + user_data.out_trade_no + "&r=" + Math.random(1), function (result) {
            if (result.code == 1) {
                alert('您所购买的商品已付款成功，感谢购买！');
                window.location.href = result.backurl;
            } else {
                setTimeout(function () {
                    check_pay() }, 5000);//5秒检测一次自己的数据是否成功
            }
        }, 'json');
    };
    check_pay();
    var clipboard = new Clipboard('.copy');
    clipboard.on('success', function (e) {
        toastr.success("复制成功,可扫码付款时候粘贴到金额栏付款");

    });
    clipboard.on('error', function (e) {
        document.querySelector('.copy');
        toastr.warning("复制失败,请记住下必须付款的金额 不能多不能少否则不能成功");
    });
</script>

</body>
</html>